import React, {Component} from 'react';
import Search from '../Public/Search';
import OrderIndexTable from './OrderIndexTable';
import http from "../../http";

import "../../assets/css/orderIndex.scss";
import Pagination from "../Public/Pagination";

class Index extends Component {
	constructor(props) {
		super(props);
		this.state = {
			select: 'orderNumber',
			search: '',
			searchMethods: [
				{
					value: 'orderNumber',
					title: '按订单号查询'
				}
			],
			pageNum: 1,
			pageSize: 10,
			total: 0,
			list: []
		}
	}

	componentDidMount() {
		this.getOrderList();
	}

	changeSelect = value => {
		this.setState({
			select: value
		})
	};

	changeSearch = value => {
		this.setState({
			search: value
		})
	};

	changePageNum = async pageNum => {
		await this.setState({
			pageNum
		});
		this.clickSearch();
	};

	clickSearch = () => {
		if (this.state.search === '') {
			this.getOrderList();
			return false;
		}
		http.searchOrderList({
			listType: 'search',
			pageNum: this.state.pageNum,
			orderNo: this.state.search
		}).then(res => {
			if (res.status === 0) {
				this.setState({
					total: res.data.total,
					pageSize: res.data.pageSize,
					list: res.data.list
				})
			} else if (res.status === 10) {
				alert(res.msg);
				this.props.history.push('/login');
			}
		})
	};

	getOrderList = () => {
		http.getOrderList(this.state.pageNum).then(res => {
			if (res.status === 0) {
				this.setState({
					total: res.data.total,
					pageSize: res.data.pageSize,
					list: res.data.list
				})
			} else if (res.status === 10) {
				alert(res.msg);
				this.props.history.push('/login');
			}
		})
	};

	render() {
		return (
			<div>
				<div className="home-title">
					订单管理
				</div>
				<div className="order-search-container">
					<Search
						select={this.state.select}
						search={this.state.search}
						searchMethods={this.state.searchMethods}
						changeSelect={this.changeSelect}
						changeSearch={this.changeSearch}
						clickSearch={this.clickSearch}
						placeholder="订单号"
					/>
				</div>
				<OrderIndexTable data={this.state.list}/>
				<Pagination
					pageSize={this.state.pageSize}
					pageNum={this.state.pageNum}
					total={this.state.total}
					onChange={this.changePageNum}
				/>
			</div>
		);
	}
}

export default Index;